<!DOCTYPE html>
<html lang="zh-CN">
<head>
	<meta charset="UTF-8">
	<title>clock</title>
  <link href="https://fonts.googleapis.com/css2?family=Oswald:wght@700&display=swap" rel="stylesheet">
	<style>
        body {
          color: #000000;
          background-color: #ffffff;
          font-family: Arial,sans-serif;
        }

        .app {
          position: fixed;
          width: 100%;
          height: 100%;
        }

        .time {
        	width: 100%;
        	margin: auto;
          text-align: center;
          padding-top: 120px;
          font-size: 16rem;
          font-family: 'Oswald', sans-serif;
          font-weight: 700;
        }

        .date {
        	width: 100%;
        	text-align: center;
          padding-top: 40px;
          font-size: 2rem;
          font-weight: bold;
        }
    </style>
</head>
<body>
	 <div class="app">
      <div class="time" id="time">16:07</div>
      <div class="date">
          <span id="date">4月19日</span> <span id="week">星期日</span>
      </div>
    </div>
    <script>
      function update() {
        var date = new Date();
        var utc8DiffMinutes = date.getTimezoneOffset() + 480;
        date.setMinutes(date.getMinutes() + utc8DiffMinutes);

        var timeString = date.getHours() + ':' + ('0' + date.getMinutes()).slice(-2);
        var dateString = (date.getMonth() + 1) + '月' + date.getDate() + '日';
        var weekList = ['日', '一', '二', '三', '四', '五', '六'];
        // var weekJpList = [' 日曜日', ' 月曜日', ' 火曜日', ' 水曜日', ' 木曜日', ' 金曜日', ' 土曜日'];
        var weekString = '星期' + weekList[date.getDay()];
        document.getElementById("time").innerHTML = timeString
        document.getElementById("date").innerHTML = dateString
        document.getElementById("week").innerHTML = weekString
      }
      update()
      setInterval("update()", 60 * 1000)
    </script>
</body>
</html>